<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>事件的基本使用</title>
    <script type="text/javascript" src="../js/vue.js"></script>
</head>

<body>

    <div id="root">
        <h2>{{name}}学习</h2>
        <!-- <button v-on:click="showInfo">点我</button> -->
        <!-- 事件绑定简写形式：@click -->
        <button @click="showInfo1">点我1(不传参)</button>
        <button @click="showInfo2($event,666)">点我2（传参）</button>
    </div>

    <script type="text/javascript">



        const vm = new Vue({
            el: "#root",
            data: {
                name: "good"
            },
            methods: {
                showInfo1(event) {
                    alert("nihao1")
                },
                showInfo2(event, number) {
                    alert('nihao!!' + number)
                    console.log(event)
                    console.log(number)
                }
            }
        })

    </script>
</body>

</html>